/* !READ ME: THis CSS file adds Style to the FastPass screens. This is a 3ed party implementation.  */

/* (Note) : Please note that this style sheet has numerous class edits. Typically, one might define a single style set per class or ID,
            but in this case, we cannot adhere strictly to that principle. The goal is to augment existing FastPass styles without deletions,
            leading to multiple styles for some selectors as required by the project's unique constraints.
*/

/* ? (t) Import Start */

@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");

/* ? (t) Import End */

/* ? (t) Start of Theme */

:root {
  /* Background gradient for screens */
  --screen-bg: linear-gradient(
    to bottom,
    rgb(221, 221, 221),
    rgb(192, 192, 191)
  );

  /* Default font family */
  --font-family: "Poppins", sans-serif;
  /* Default font weight */

  --font-color: #1b1d21;
  --detail-font-color: #44484a;

  /* Primary button background color */
  --p-btn-bg-color: #e22e38;
  /* Primary button text color */
  --btn-hover-color: white;
  /* Primary button border color */
  /* Background color for bordered buttons */
  --button-bordered-bg: rgb(238, 238, 238);
}

/* ? (t) End of Theme */

/* ? (t) Self Service text sizing components Start */

#ctl00_labelApplicationTitle {
  font-weight: 400 !important;
  font-size: 1.125em !important;
  line-height: normal;
  text-transform: uppercase;
}

#ctl00_labelSolutionTitle {
  font-size: 0.875em !important;
  font-weight: 700 !important;
}

.wizard-button-content-headertext,
.control-label {
  font-size: 0.875em;
  font-weight: 500 !important;
  color: var(--font-color) !important;
}

#ctl00_labelTrackName {
  font-size: 1.5em !important;
  font-weight: 500 !important;
  color: var(--font-color) !important;
}

#ctl00_ContentPlaceHolder1_labHeadingStep {
  font-size: 1.125em !important;
  font-weight: 500 !important;
  color: var(--font-color) !important;
}

#ctl00_ContentPlaceHolder1_labIntroduction {
  font-size: 1em !important;
  font-weight: 400;
  line-height: 24px;
}

.wizard-button-content-detailtext p,
.alert-introduction-text {
  font-size: 0.875em !important;
  font-weight: 400 !important;
  color: var(--detail-font-color) !important ;
}

.control-value {
  color: var(--detail-font-color) !important;
  font-size: 0.875em;
}

.btn-primary,
.btn-default {
  font-size: 0.875em !important;
  font-weight: 500 !important;
}

.complexityindicator-mainrequirement,
.complexityindicator-subrequirement {
  font-size: 12px !important;
}

.content__main-link-imagediv,
.wizard-icon-action-connectidentityverification,
.wizard-icon-action-enrolluser,
.wizard-icon-action-unlockaccount,
.wizard-icon-action-resetpassword,
.wizard-icon-action-changepassword {
  color: white !important;
}

.complexityindicator-subrequirement-maybeok {
  color: var(--detail-font-color) !important;
}

.modal-title {
  font-size: 18px !important;
  font-weight: 600;
}

input[id*="tbox"] {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--detail-font-color) !important;
  font-family: var(--font-family);
}

[id*="subPageR"] > span {
  font-size: 1em;
  font-weight: 500;
}

[id*="subPageR"] > span[id*="_labQuestion"] {
  font-size: 0.875em !important;
  font-weight: 500;
}

.control-required-field-validator,
#ctl00_ContentPlaceHolder1_labCaptchaValidationMsg {
  font-size: 0.875em !important;
  padding-top: 5px;
}

/* ? (t) Self Service text sizing components End */

/* ? (t) Font Faces Start */

@font-face {
  font-family: "Glyphicons Halflings";
  src: url(/FastPassCorp/skins/CustomFiles/AddorRemoveStyling/fonts/glyphicons-halflings-regular.eot);
  src: url(/FastPassCorp/skins/CustomFiles/AddorRemoveStyling/fonts/glyphicons-halflings-regular.eot?#iefix)
      format("embedded-opentype"),
    url(/FastPassCorp/skins/CustomFiles/AddorRemoveStyling/fonts/glyphicons-halflings-regular.woff2)
      format("woff2"),
    url(/FastPassCorp/skins/CustomFiles/AddorRemoveStyling/fonts/glyphicons-halflings-regular.woff)
      format("woff"),
    url(/FastPassCorp/skins/CustomFiles/AddorRemoveStyling/fonts/glyphicons-halflings-regular.ttf)
      format("truetype"),
    url(/FastPassCorp/skins/CustomFiles/AddorRemoveStyling/fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular)
      format("svg");
}

@font-face {
  font-family: "FontAwesome";
  font-display: block;
  src: url(/FastPassCorp/skins/CustomFiles/AddorRemoveStyling/fonts/fa-solid-900.woff2)
      format("woff2"),
    url(/FastPassCorp/skins/CustomFiles/AddorRemoveStyling/fonts/fa-solid-900.ttf)
      format("truetype");
}

@font-face {
  font-family: "Custom";
  font-display: block;
  src: url(/FastPassCorp/skins/CustomFiles/AddorRemoveStyling/fonts/Custom-Icons.woff)
      format("woff"),
    url(/FastPassCorp/skins/CustomFiles/AddorRemoveStyling/fonts/Custom-Icons.ttf)
      format("truetype");
}

@font-face {
  font-display: block;
  font-family: "bootstrap-icons";
  src: url(/FastPassCorp/skins/CustomFiles/AddorRemoveStyling/fonts/bootstrap-icons.woff2)
      format("woff2"),
    url(/FastPassCorp/skins/CustomFiles/AddorRemoveStyling/fonts/bootstrap-icons.woff)
      format("woff");
}

/* ? (t) Font Faces end */

/* ! ----------------------------------- From here on down wont be effected by Themes ------------------- */

/* ? ----------------------------------- Changes Applicable to All Screens ------------------------------ */

*[style*="visibility:hidden;"] {
  display: none !important;
}

body[id="masterPageBody"],
body[id="pageBody"] {
  min-height: 100vh;
  font-family: var(--font-family) !important;
  font-weight: var(--font-weight) !important;
  font-size: var(--font-size) !important;
  color: var(--font-color);
  overflow-x: hidden;
}

body[id="pageBody"] {
  background-color: transparent !important;
}

body[id="masterPageBody"] {
  background: var(--screen-bg);
  padding-top: 10px;
}

/* ? ----------------------------------- MyPass Default Style Reset & Customizations ------------------- */

/* info deleted CSS & reformat */
.masterpage-header,
.masterpage-header-left,
.masterpage-header-center,
.masterpage-header-right,
.masterpage-pageheader,
.masterpage-pageheader-left,
.masterpage-pageheader-center,
.masterpage-pageheader-center,
.masterpage-pageheader-right,
.masterpage-header-center-outer,
.masterpage-organizationlogo-outerdiv,
p,
span,
.alert-introduction-step {
  all: revert;
}
.masterpage-organizationlogo-image,
.masterpage-solutiontitle-outerdiv,
.masterpage-applicationtitle-outerdiv {
  all: revert !important;
}

.masterpage-pageheader div:nth-child(2) {
  padding-left: 0;
  padding-right: 0;
}

#SolutionTitle,
#ApplicationTitle {
  padding-right: 20px;
}

.wizard-button-content-detailtext p {
  height: revert;
  min-height: revert;
  max-height: revert;
}

.wizard-button-content-warningtext {
  min-height: revert;
  max-height: revert;
}
.wizard-button-content {
  display: flex;
  min-height: revert;
  padding: 20px;
  align-items: center;
}

.wizard-button-content-warningtext {
  min-height: revert;
  max-height: revert;
}

.alert-introduction-panel {
  min-height: revert !important;
}

.alert-introduction-text {
  padding: 5px 0px 25px 0px;
  #wizardPageIdentityVerificationConnectConnect &,
  #wizardPageLoginProblemComputerWindows &,
  #wizardPageEnrollmentEnrollUserEnrollUser & {
    display: none !important;
  }
  @media screen {
    @media (max-width: 620px) {
      & {
        padding: 5px 0px 15px 0px;
      }
    }
  }
}

.alert-introduction-step {
  #wizardPageIdentityVerificationConnectConnect &,
  #wizardPageLoginProblemComputerWindows &,
  #wizardPageEnrollmentEnrollUserEnrollUser & {
    padding: 5px 0px 10px 0px !important;
  }
}

.form-control:focus {
  box-shadow: var(--input-box-shadow);
}

#ctl00_divLanguage {
  display: flex !important;
  justify-content: center !important;
}

.masterpage-main-inner-top-cell2-label {
  min-height: 0px !important;
  display: flex !important;
  justify-content: center !important;

  .visible-lg-inline {
    display: none;
  }
}

.masterpage-header:has(#ctl00_blddLanguage[style="display:none;"]) {
  display: none !important;
}

.Blank {
  display: none !important;
}
/* ? ----------------------------------- Primary Button ------------------------------------------------- */

.btn-primary {
  background-color: var(--p-btn-bg-color);
  color: var(--btn-hover-color);
  border-color: transparent !important;
  border-radius: 5px;
  transition: all 0.3s;
  &:hover {
    color: white;
    background-color: var(--p-btn-bg-color);
  }
  &:focus {
    box-shadow: none !important;
    background-color: var(--p-btn-bg-color);
    border-color: var(--p-btn-bg-color);
    border-radius: 4px;
    border-width: 2px;
  }
  &:active:focus {
    box-shadow: none !important;
  }
  &:disabled {
    background-color: var(--p-btn-bg-color);
    border-color: var(--p-btn-bg-color);
    border-radius: 4px;
    border-width: 2px;
  }
}

/* ? ----------------------------------- Secondary Button ----------------------------------------------- */

.btn-default {
  fill: var(--p-btn-bg-color);
  color: var(--p-btn-bg-color);
  border-color: var(--p-btn-bg-color);
  background-color: #ffffff;
  border-radius: 4px;
  border-width: 2px;
  transition: all 0.3s;
  &:hover {
    color: var(--p-btn-bg-color);
    background-color: white;
  }
  &:focus {
    box-shadow: none !important;
    border-color: var(--p-btn-bg-color);
    background-color: var(--p-btn-bg-color);
    border-radius: 4px;
    border-width: 2px;
  }
  &:active:focus {
    box-shadow: none !important;
  }
}

/* ? ----------------------------------- Span & p tags -------------------------------------------------- */

/* ? ----------------------------------- Inputs --------------------------------------------------------- */

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  -webkit-box-shadow: transparent !important;
  transition: background-color 5000s ease-in-out 0s;
}

textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
  box-shadow: 8px 8px 15px 0px rgba(0, 0, 0, 0.1);
}

input[id*="tbox"],
input[id*="_txtPrimaryEmailAddress"],
input#txtChallenge,
input[id*="_txtAlternateEmailAddress"],
input[id*="_txtPrimaryMobileNumber"],
input[id*="_tboxPin"] {
  max-width: 200px !important;
  width: 100% !important;
  background-color: white !important;
  border: 2px solid #dbdcdd !important;
  border-radius: 6px !important;
  padding: 10px 15px;
  line-height: 1.2;
  box-shadow: none !important;
  height: 40px;
}

textarea {
  max-width: 200px !important;
  width: 100% !important;
  background-color: white !important;
  border: 2px solid #dbdcdd;
  border-radius: 6px !important;
  line-height: 1.2;
  padding: 10px 15px;
  box-shadow: none !important;
}

input[id*="_txtAnswer"],
input[id*="_txtCAnswer"] {
  max-width: 300px !important;
  width: 100% !important;
  background-color: white !important;
  border: 2px solid #dbdcdd !important;
  border-radius: 6px !important;
  padding: 10px 15px;
  line-height: 1.2;
  box-shadow: none !important;
  height: 40px !important;
  @media screen {
    @media (max-width: 620px) {
      height: 35px !important;
    }
  }
}

input[id*="tbox"]:-webkit-autofill {
  -webkit-text-fill-color: var(--detail-font-color) !important;
}

[id*="chkbox"]:checked {
  background-color: var(--p-btn-bg-color);
}

/* ? ----------------------------------- Scrollbar ------------------------------------------------------ */

/* info width */
::-webkit-scrollbar {
  width: 5px !important;
}

::-webkit-scrollbar-thumb {
  background: var(--p-btn-bg-color) !important;
  border-radius: 4px;
}

::-webkit-scrollbar {
  display: none !important;
}

/* ? --- loading Spinner (Not Needed if you want to use stock version delete everything in the block) --- */

.spin::after,
.spin::before {
  all: revert !important;
}

.spin {
  border-color: transparent !important;
  color: white;
  font-size: 80px;
  text-indent: -9999em;
  overflow: hidden;
  width: 1em;
  height: 1em;
  border-radius: 50%;
  position: relative;
  transform: translateZ(0);
  animation: mltShdSpin 2s infinite ease, round 2s infinite ease;
  top: 50%;
}

@keyframes mltShdSpin {
  0% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em,
      0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  5%,
  95% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em,
      0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
  10%,
  59% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em,
      -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em,
      -0.297em -0.775em 0 -0.477em;
  }
  20% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em,
      -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em,
      -0.749em -0.34em 0 -0.477em;
  }
  38% {
    box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em,
      -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em,
      -0.82em -0.09em 0 -0.477em;
  }
  100% {
    box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em,
      0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
  }
}

@keyframes round {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

/* ? --- loading Spinner (Not Needed if you want to use stock version delete everything in the block) --- */

#mainPageContainer {
  padding: 25px 20px;
  background-color: white;
  border-radius: 8px;
  box-shadow: 5px 5px 35px -14px rgba(0, 0, 0, 0.17);
  margin-bottom: 50px !important;
  margin-top: 20px;
  position: static;

  @media screen {
    @media (max-width: 750px) {
      padding: 15px 10px;
    }
  }
}

#ctl00_blddLanguage {
  position: static;
}

.masterpage-header-center-inner {
  padding: 0px;
  @media (min-width: 750px) and (max-width: 900px) {
    margin: 0px;
  }
}

.masterpage-language-innerdiv {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  width: 900px;
  padding: 0px;
  text-align: right;
  vertical-align: top;
  height: 35px;
  margin-top: 20px;
  height: fit-content;
  @media screen {
    @media (max-width: 750px) {
      width: 100%;
      padding: 0px !important;
      justify-content: flex-start;
      padding: 5px;
    }
    @media (min-width: 750px) and (max-width: 900px) {
      & {
        margin: 0px;
      }
    }
  }
}

#ctl00_masterpage__pageheader__center {
  display: flex;
  justify-content: space-between;
  background-color: white;
  border-radius: 8px;
  padding: 20px 12px;
  box-shadow: 5px 5px 35px -14px rgba(0, 0, 0, 0.17);
  margin-top: 20px;
  @media screen {
    @media (max-width: 750px) {
      margin-top: 20px;
      justify-content: center;
    }
  }
}

#masterpage__organizationlogo {
  width: auto;
  height: auto;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: center;
  padding-left: 20px;

  @media screen {
    @media (max-width: 750px) {
      height: 50px;
      padding-left: 10px !important;
      #ctl00_masterPageLogo {
        padding: 0px 10px !important;
      }
    }
  }
}

.masterpage__headertitle {
  display: flex;
  flex-direction: column-reverse;
  flex-wrap: wrap;
  justify-content: center;
  width: fit-content;
  text-align: end;
  padding-right: 50px;

  @media screen {
    @media (max-width: 750px) {
      margin-left: 10px;
      margin-right: auto;

      &.shift-Left {
        margin-left: auto;
        margin-right: 10px;

        #SolutionTitle {
          width: 100% !important;
          justify-content: flex-end !important;
        }
      }
    }
  }
}

#masterpage__applicationtitle {
  margin-bottom: 5px;
}

.masterpage-main-inner-top {
  display: flex;
  flex-direction: row;
}

.content__heading {
  display: none;
}

#divLanguageLabel {
  display: none !important;
}

.control-value {
  padding-top: 0px;
  padding-left: 0px !important;
  &:has(input) {
    max-width: 200px;
  }

  .form-group.row & {
    max-width: 200px !important;
    width: -webkit-fill-available;
  }

  &:has(#PasswordComplexityIndicator) {
    width: 90% !important;
  }

  #ctl00_ContentPlaceHolder1_subPageR13:has(.TOTPAuthenticatorQRCode) & {
    width: 100% !important;
    margin-right: 0px !important;
    padding-right: 0px !important;
    display: flex;
    justify-content: center;
  }

  @media screen {
    @media (max-width: 1000px) {
      .content-wrapper-Reg-TOTP #ctl00_ContentPlaceHolder1_subPageR13 & {
        padding: 0px;
        display: flex;
        justify-content: center;
        position: static;
      }

      .content-wrapper-challenge & {
        width: fit-content;
        max-width: 60%;
      }
    }
    @media (max-width: 620px) {
      & {
        padding-left: 0px;
        text-align: center;
        font-size: 13px !important;
      }
      .content-wrapper-TOTP-auth & {
        padding-left: 0px !important;
        text-align: center;
      }
      .content-wrapper-Change-Password & {
        display: flex;
        align-items: center;
        flex-direction: column;
      }
      .content-wrapper-Auth-Password .form-group.row & {
        padding: 0px !important;
      }
    }
  }
}

.masterpage-main-inner-top-cell2 {
  width: 100%;
  padding: 0 !important;
}

#ctl00_labelTrackNameCaption,
.masterpage-main-inner-top-cell1 {
  display: none;
}

#wizardPage1 div.alert-introduction-text {
  text-align: center;
}

.wizardpage-content-header {
  background-color: transparent;
  .col-sm-12 {
    padding: 0px;
    margin: 0px;
    min-height: fit-content;
    border: none;
    background-color: transparent;
  }
}

.messagebox-bootstrap-Inline {
  padding: 0px;
  margin: 0px;
  min-height: fit-content;
  border: none;
  background-color: transparent;
}

.masterpage-organizationlogo-image {
  max-width: fit-content;
  max-height: 65px;
  @media screen {
    @media (max-width: 620px) {
      & {
        display: none !important;
      }
    }
  }
}

.content__main-link-imagediv {
  min-height: 64px !important;
  min-width: 79px !important;
  max-height: 64px !important;
  max-width: 79px !important;
  background-color: transparent;
  background-image: none !important;

  &.content__main-link-imagediv-FastPass::before {
    display: flex;
    font-family: "Custom";
    content: "\e905";
    font-size: 69px;
    line-height: 64px;
    width: 79px;
    justify-content: center;
  }

  &.content__main-link-imagediv-ActionConnectIdentityVerification::before {
    display: flex;
    font-family: "Custom";
    content: "\e904";
    font-size: 30px;
    line-height: 64px;
    width: 79px;
    justify-content: center;
  }

  &.content__main-link-imagediv-ActionEnrollUser::before {
    display: flex;
    font-family: "Custom";
    content: "\e902";
    font-size: 26px;
    line-height: 64px;
    width: 79px;
    justify-content: center;
  }

  &.wizard-icon-action-enrolluser::before {
    display: flex;
    font-family: "Custom";
    content: "\e90b";
    font-size: 26px;
    line-height: 64px;
    width: 79px;
    justify-content: center;
  }

  &.wizard-icon-action-enrolluserhelpdeskpin::before {
    display: flex;
    font-family: "Custom";
    content: "\e90a";
    font-size: 26px;
    line-height: 64px;
    width: 79px;
    justify-content: center;
  }

  &.content__main-link-imagediv-TechComputerLogin::before {
    display: flex;
    font-family: "Custom";
    content: "\e901";
    font-size: 35px;
    line-height: 64px;
    width: 79px;
    justify-content: center;
  }

  @media screen {
    @media (max-width: 460px) {
      & {
        min-height: 50px !important;
        min-width: 59px !important;
        max-height: 50px !important;
        max-width: 59px !important;
        .wizard-icon-action-size-with-smallicon {
          display: flex;
          justify-content: center;
        }
      }
      &.content__main-link-imagediv-ActionEnrollUser::before {
        font-size: 21px;
        line-height: 50px;
        width: 59px;
      }
      &.content__main-link-imagediv-TechComputerLogin::before {
        font-size: 30px;
        line-height: 50px;
        width: 59px;
      }
      &.content__main-link-imagediv-FastPass::before {
        font-size: 50px !important;
        line-height: 50px !important;
        width: 59px !important;
      }
      &.content__main-link-imagediv-ActionConnectIdentityVerification::before {
        font-size: 25px;
        line-height: 50px;
        width: 59px;
      }
    }
  }
}

.wizard-icon-action-size-with-smallicon {
  min-height: 64px !important;
  min-width: 79px !important;
  max-height: 64px !important;
  max-width: 79px !important;
  @media screen {
    @media (max-width: 480px) {
      min-height: 50px !important;
      min-width: 59px !important;
      max-height: 50px !important;
      max-width: 59px !important;
    }
  }
}

.content__main-link-image {
  background-color: transparent;
  vertical-align: middle;
  border-radius: none;
  flex-wrap: wrap;
  flex-direction: column;
  align-content: center;
  justify-content: space-around;
  display: flex !important;
  align-items: center;
  margin-bottom: 0px !important;
  height: 100% !important;
  width: fit-content !important;
  margin-right: 15px;
  @media screen {
    @media (min-width: 750px) and (max-width: 900px) {
      & {
        margin-right: 10px;
        display: table-cell !important;
        vertical-align: middle !important;
        width: 80px !important;
        border-radius: 5px;
      }
    }
    @media (max-width: 460px) {
      & {
        display: flex !important;
        align-items: center;
        margin: 0px !important;
      }
    }
    @media (max-width: 460px) {
      & {
        margin-bottom: 10px;
      }
    }
  }
}

.wizard-button-content-row {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  border-radius: 8px;
  border-color: transparent;
  width: 100%;

  &::after {
    display: flex;
    font-family: "Custom";
    content: "\e906";
    background: var(--p-btn-bg-color) !important;
    -webkit-text-fill-color: transparent;
    background-clip: text !important;
    font-size: 55px;
    line-height: 64px !important;
    justify-content: center;
    position: absolute;
    right: 0%;
    align-content: center;
    flex-wrap: wrap;
  }

  @media screen {
    @media (max-width: 850px) {
      &::after {
        display: none;
      }
    }
    @media (max-width: 750px) {
      &::after {
        display: none;
      }
    }
    @media (max-width: 460px) {
      & {
        justify-content: center;
      }
    }
  }
}

#ctl00_ContentPlaceHolder1_divIntroduction {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  border-radius: 8px;
  width: 100%;
  border: 1px solid transparent;
  transition: all 0.3s linear;
  background-color: transparent;
  min-height: fit-content;
  padding-bottom: 25px;

  &:has(.alert-introduction-text) {
    margin: 0px;
    padding: 0px;
  }

  @media screen {
    @media (max-width: 750px) {
      & {
        justify-content: center;
      }
    }
    @media (max-width: 620px) {
      & {
        width: fit-content;
        padding-bottom: 15px;
        > div {
          width: fit-content;
        }
      }
    }
    @media (max-width: 460px) {
      & {
        justify-content: center;
      }
    }
  }
}

.content__main-link {
  border: 1px solid transparent;
  transition: all 0.3s linear;
  p,
  h2 {
    margin: 0;
    padding: 2.5px 0px;
  }
  &:hover {
    border-style: solid;
    border-width: 1px 1px 1px 1px;
    border-color: #dbdcdd;
    box-shadow: none !important;
  }
}

.wizard-icon-action-enrolluser {
  background-color: transparent;
  min-height: 60px !important;
  min-width: 80px !important;
  background-image: none !important;
  @media (max-width: 460px){
    min-width: 62px !important;
  }
  &.wizard-icon-authentication-password::before {
    display: flex;
    font-family: "bootstrap-icons";
    content: "\f228";
    font-size: 30px;
    line-height: 64px;
    justify-content: center;
  }
  &.wizard-icon-enroll-totp::before {
    display: flex;
    font-family: "Custom";
    content: "\e900";
    font-size: 30px;
    line-height: 64px;
    justify-content: center;
    text-decoration-style: dashed;
    text-decoration-line: underline;
    text-underline-offset: 7px;
    text-decoration-thickness: from-font;
  }
  &.wizard-icon-enroll-sms::before {
    display: flex;
    font-family: "FontAwesome";
    content: "\f7cd";
    font-size: 30px;
    line-height: 64px;
    justify-content: center;
  }
  &.wizard-icon-enroll-semi-private-qa::before {
    display: flex;
    font-family: "FontAwesome";
    content: "\f059";
    font-size: 30px;
    line-height: 64px;
    justify-content: center;
  }
  &.wizard-icon-enroll-private-qa::before {
    display: flex;
    font-family: "FontAwesome";
    content: "\f06a";
    font-size: 30px;
    line-height: 64px;
    justify-content: center;
  }
  &.wizard-icon-enroll-code-card::before {
    display: flex;
    font-family: "bootstrap-icons";
    content: "\f228";
    font-size: 30px;
    line-height: 64px;
    justify-content: center;
  }

  @media screen {
    @media (max-width: 480px) {
      &.wizard-icon-enroll-totp::before,
      &.wizard-icon-enroll-sms::before,
      &.wizard-icon-enroll-semi-private-qa::before,
      &.wizard-icon-enroll-private-qa::before,
      &.wizard-icon-enroll-code-card::before {
        font-size: 25px;
        line-height: 60px;
      }
    }
  }
}

.multi-auth-ico {
  &::before {
    display: flex;
    font-family: "Custom" !important;
    content: "\e909" !important;
    font-size: 45px !important;
    line-height: 64px;
    justify-content: center;
  }
  @media screen {
    @media (max-width: 480px) {
      &::before {
        font-size: 38px !important;
        line-height: 60px;
      }
    }
  }
}

.wizard-button-content-cell1 {
  @media screen {
    @media (max-width: 480px) {
      & {
        width: 59px !important;
      }
    }
  }
}

.content__main-link-text {
  padding: 0px;
  width: calc(100% - 95px);
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  height: fit-content;
  .wizard-button-content-cell2 {
    width: 90%;
  }

  @media screen {
    @media (max-width: 850px) {
      .wizard-button-content-cell2 {
        width: 100%;
      }
    }
    @media (min-width: 750px) {
      & {
        display: table-cell;
        vertical-align: top;
      }
    }
    @media (max-width: 460px) {
      & {
        width: 100% !important;
      }
    }
  }
}

.wizard-button-content-cell1 {
  background: var(--p-btn-bg-color);
  border-radius: 5px;
  width: 79px;
  height: fit-content !important;
}

.wizard-button-content-line-wider {
  display: None;
}

.wizard-button-bordered {
  background-repeat: no-repeat;
  background-position: right;
  background-position-x: 750px;
  background-color: var(--button-bordered-bg);
  border-radius: 6px;
  border-color: transparent;
  margin-bottom: 15px;
  & > div {
    margin-bottom: 0px !important;
  }
}

#divIntroductionTextPanelCellOuter {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-content: space-around;

  div {
    text-align: center;
  }
}

.control-label {
  margin-right: 10px !important;
  width: fit-content !important;
  padding: 0 !important;
  margin-bottom: revert !important;
  min-width: 130px;
  text-align: right !important;
  display: flex;
  justify-content: flex-end;
}

.TOTPAuthenticatorSkipOption {
  max-width: 100% !important;
  padding: 0px 10% !important;
  text-align: center;
  margin-top: 10px;
}

[id*="ctl00_ContentPlaceHolder1_subPageR"] {
  display: flex !important;
  margin-top: 10px;
  align-items: flex-start;
  flex-wrap: nowrap;
  justify-content: flex-start;
  --bs-gutter-x: 0rem !important;
  width: 100%;
  justify-content: center !important;

  &:has(input) .control-label > span {
    padding-top: 10px !important;
  }

  &[style="visibility: hidden; display: none;"],
  &[style="visibility:hidden;display:none;"] {
    display: none !important;
  }

  .content-wrapper & {
    justify-content: left !important;

    > div:first-of-type {
      min-width: 38% !important;
    }
  }

  & > div:nth-of-type(2):not(.TOTPAuthenticatorSkipOption) {
    max-width: 200px !important;
    width: -webkit-fill-available;
  }

  & > div:first-of-type {
    min-width: 150px !important;
  }

  @media screen {
    @media (max-width: 1000px) {
      .content-wrapper-TOTP-auth &,
      .content-wrapper-SMS-pin &,
      .content-wrapper-Reg-TOTP & {
        padding: 0px !important;
        width: 100%;
      }
    }
    @media (max-width: 620px) {
      .content-wrapper-SMS-pin & {
        display: flex !important;
        align-items: center !important;
        flex-direction: column;
        margin-left: 0px !important;
        width: 100%;
      }
      & > div:last-of-type:not(.TOTPAuthenticatorSkipOption) {
        padding-left: 0px !important;
        padding-right: 0px !important;
        display: flex;
        width: 100% !important;
        flex-direction: column;
        align-items: center;
      }
      .content-wrapper-TOTP-auth &,
      .content-wrapper-SMS-pin &,
      .content-wrapper-Reg-TOTP & {
        padding: 0px !important;
        width: fit-content !important;
      }
    }
  }
}

.form-group {
  display: flex !important;
  margin-top: 10px;
  align-items: flex-start;
  min-height: 20px;
  --bs-gutter-x: 0rem;
  justify-content: center;

  .content-wrapper-Reg-Personal &:has(.col-sm-3:not(.control-label)) {
    display: none !important;
  }

  &:has(input) .control-label > span {
    padding-top: 10px !important;
  }
  &.row,
  &:has(#subPageR11C01),
  &:has(#ctl00_ContentPlaceHolder1_tboxSmsChallCode) {
    display: flex !important;
    margin-top: 10px;
    align-items: flex-start;
    flex-wrap: wrap;
    justify-content: flex-start;
    --bs-gutter-x: 0rem !important;
    width: 100%;
    justify-content: center !important;
  }

  .content-wrapper-Reg-Personal &.row[id*="LinePrivate"],
  .content-wrapper-Reg-Personal &.row[id*="SemiPrivate"] {
    margin-top: 0px !important;
  }

  &.row .control-label {
    margin-top: 0px;
    min-width: 150px !important;
  }

  #subPageR11C02,
  &:has(#ctl00_ContentPlaceHolder1_tboxSmsChallCode) > div:last-of-type {
    max-width: 200px !important;
    width: -webkit-fill-available;
  }

  #subPageR11C01,
  &:has(#ctl00_ContentPlaceHolder1_tboxSmsChallCode) > div:first-of-type {
    min-width: 150px !important;
  }

  &:has(#ctl00_ContentPlaceHolder1_tboxPassword) {
    align-items: flex-start !important;
  }

  &[style="display:none;"],
  &[style="display: none;"] {
    display: none !important;
  }

  @media screen {
    @media (max-width: 620px) {
      &:has(input) .control-label > span {
        padding-top: 0px !important;
      }
    }
  }
}

#subPageR10 {
  display: flex !important;
  margin-top: 10px;
  align-items: flex-start;
  flex-wrap: nowrap;
  justify-content: flex-start;
  --bs-gutter-x: 0rem !important;
  width: 100%;
  justify-content: center !important;
  #subPageR10C03 {
    max-width: 200px !important;
    width: -webkit-fill-available;
  }
  > div:first-of-type {
    min-width: 150px !important;
  }
}

#ctl00_ContentPlaceHolder1_RowName,
#ctl00_ContentPlaceHolder1_RowUserId,
#ctl00_ContentPlaceHolder1_RowDomainName {
  display: flex !important;
  margin-top: 10px;
  align-items: flex-start;
  flex-wrap: nowrap;
  --bs-gutter-x: 0rem !important;
  width: 100%;
  justify-content: center !important;
  & .control-value {
    max-width: 200px !important;
  }
  & .control-label {
    min-width: 150px !important;
  }

  @media (max-width: 620px) {
    & {
      width: 198px !important;
      justify-content: flex-start !important;
    }
    & .control-label {
      justify-content: flex-start !important;
      min-width: 80px !important;
    }
  }
}

form[action="./AuthenticatePassword.aspx"], form[action="./AuthenticateHelpDeskPin.aspx"], form[action="./AuthenticateEmailPin.aspx"] {
  .col-lg-9.control-value:has(#ctl00_ContentPlaceHolder1_labUserId), 
  .col-lg-9.control-value:has(#ctl00_ContentPlaceHolder1_labDomainName),
  .col-md-9:has(#ctl00_ContentPlaceHolder1_tboxPassword),
  .col-md-9:has(#ctl00_ContentPlaceHolder1_tboxPin),
  #ctl00_ContentPlaceHolder1_subPageR10, #subPageR11 {
    width: fit-content;
    padding: 0px !important;
    @media (max-width: 620px) {
        width: 100% !important;  
    }
  }

  .col-md-9:has(#ctl00_ContentPlaceHolder1_tboxPassword),
  .col-md-9:has(#ctl00_ContentPlaceHolder1_tboxPin) {
    padding: 0px !important;
    @media (max-width: 620px) {
      display: flex;
      justify-content: center;  
    }
  }

  #ctl00_ContentPlaceHolder1_labPassword,#ctl00_ContentPlaceHolder1_tboxPin {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
  }

  .mb-3:has(#ctl00_ContentPlaceHolder1_labUserId),
  .mb-3:has(#ctl00_ContentPlaceHolder1_labDomainName),
  .mb-3:has(#ctl00_ContentPlaceHolder1_labPassword),
  .mb-3:has(#ctl00_ContentPlaceHolder1_labPin),
  #ctl00_ContentPlaceHolder1_subPageR10, #subPageR11 {
    display: flex !important;
    margin-bottom: 10px !important;
    @media (max-width: 1000px) {
      width: 100% !important;  
    } 
    .col-md-3, #subPageR11C01, #subPageR10C01 {
      width: 45% !important;
      @media (max-width: 620px) {
        width: 100% !important;  
      }
    }
  }
}

#ctl00_ContentPlaceHolder1_subPageR02C00TableR00, #ctl00_ContentPlaceHolder1_subPageR02C00TableR02 {
  @media (max-width: 780px) {
    display: flex !important;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center !important;
    div:nth-of-type(1) {
      width: 100% !important;
      display: flex !important;
      justify-content: center !important;
      max-width: 100% !important;
    }
    div:nth-of-type(2){
      width: 65% !important;
      display: flex !important;
      justify-content: flex-end !important;
      max-width: 100% !important;
      margin-right: 10px !important;
    }
    div:nth-of-type(3){
      width: fit-content !important;
      display: flex !important;
      justify-content: flex-start !important;
      max-width: 100% !important;
    }
    #ctl00_ContentPlaceHolder1_subPageR02C00TableR00C01VerificationStatusImage, #ctl00_ContentPlaceHolder1_subPageR02C00TableR02C01VerificationStatusImage, #ctl00_ContentPlaceHolder1_subPageR02C00TableR02C01IsMandatoryImage {
      width: fit-content !important;
    }
    #ctl00_ContentPlaceHolder1_subPageR02C00TableR00C01IsMandatoryImage, #ctl00_ContentPlaceHolder1_subPageR02C00TableR02C01IsMandatoryImage {
      display: none !important;
    }
  }
}





.col-md-9:has(#ctl00_ContentPlaceHolder1_tboxPin) {
  width: fit-content;
}

.modal-dialog {
  min-width: fit-content !important;
  width: auto !important;
}

.messagebox-bootstrap-Modal-MessageCellOuter {
    min-width: auto !important;
}

#divChallenge {
  .col-md-9:has(#txtChallenge), .col-md-3.control-label.text-start.text-md-end{
    display: flex;
    justify-content: center !important;
  }
}

form[action="./ResetPassword.aspx"], form[action="./ChangePassword.aspx"] {
  .row.mb-3 {
    justify-content: center;
  }
  .col-md-9 {
    width: fit-content !important;
     @media (max-width: 768px) {
        display: flex;
        justify-content: center;  
      }
  }
}
/* form[action="./RegisterUserInformation.aspx"] { */
  .popuppage-content{
    display: flex;
    justify-content: center;
  }
  .popuppage-content-data {
    display: flex !important;
    width: 100% !important;
    justify-content: center;
    min-width: auto !important;
  }

.modal-dialog {
  display: flex;
  min-width: auto;
  justify-content: center;
  width: -webkit-fill-available;
  min-height: 325px !important;
}
/* } */


.control-button-area {
  margin-bottom: 0px !important;
}



[id*="ctl00_ContentPlaceHolder1_Row"] {
  &.form-group.form-group-first-rowme:not([style="display:none;"]) {
    display: flex !important;
    margin-top: 10px;
    align-items: flex-start;
    flex-wrap: nowrap;
    justify-content: flex-start;
    --bs-gutter-x: 0rem !important;
    width: 100%;
    justify-content: center !important;
  }
  &.form-group.form-group-first-rowme:not([style="display:none;"]) {
    > div:last-of-type {
      max-width: 200px !important;
      width: -webkit-fill-available;
    }
    > div:first-of-type {
      min-width: 150px !important;
    }
  }
}

[id*="LinePrivate"] {
  .control-label {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .col-sm-8 {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 10px !important;
  }
}

.col-sm-8:has(> input[id*="_txtQuestionUserSpecific"]) {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: center;
  > input[id*="_txtQuestionUserSpecific"] {
    margin-top: 10px;
    width: 400px !important;
    background-color: white !important;
    border: 2px solid #dbdcdd;
    border-radius: 6px !important;
    padding: 10px 15px;
    line-height: 1.2;
    box-shadow: none !important;
    height: 40px !important;
    &.form-control:focus {
      border-color: none !important;
    }
    @media (max-width: 470px) {
      width: 300px !important;
    }
  }
}

form[action="./RegisterChallengeResponseV2.aspx"] {
  .control-label {
    justify-content: space-around !important;
    display: flex;
    flex-direction: row;
  }

  @media (min-width: 992px) {
    .col-lg-8 {
      flex: 0 0 auto;
      width: 49.267%;
    }
  }
  @media (max-width: 992px) {
    .col-lg-8 {
      display: flex;
      justify-content: center;
    }
  }
  .control-button-area {
    .col-lg-8 {
      justify-content: flex-end !important;
      display: flex !important;
    }
    .col-lg-1 {
      display: none !important;
    }
  }
}

.control-label {
  > span[id*="_labQuestionTitleUserSpecific"] {
    margin-top: 0px !important;
    padding-top: 0px !important;
  }
}

[id*="LineAnswer"] {
  margin-top: 10px !important;
  display: flex !important;
  justify-content: center !important;

  .control-label {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .col-sm-8 {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-top: 10px !important;
  }
  &.form-group.row .col-sm-8 {
    width: 100%;
    max-width: 300px;
    padding: 0px !important;
  }
  &.form-group.row .control-label {
    width: fit-content !important;
    min-width: 90px !important;
    margin: 0px !important;
    margin-right: 10px !important;
    &.Answer, &.Confirm {
      margin-top: 20px !important;
    }
  }
  .col-sm-8 {
    padding-left: calc(var(--bs-gutter-x) * 0.5);
  }
  span[id*="RequiredFieldValidator"][style="display: inline;"], span[id*="CompareValidatorAnswers"][style="display: inline;"] {
    display: block !important ;
    max-width: 300px !important;
    width: -webkit-fill-available !important;
    padding: 0 !important;
    margin-top: 10px !important;
  }
  .col-sm-3.control-label > span {
    padding-top: 10px !important;
  }
}

[id*="LineSemiPrivate"] {
  .control-label {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
}

span {

  &#ctl00_ContentPlaceHolder1_RequiredFieldValidator1[style="visibility:hidden;"] {
    display: none !important;
  }
}

[id*="txtCAnswer"],
[id*="txtAnswer"] {
  max-width: 400px !important;
}

[id*="ctl00_ContentPlaceHolder1_subPageR02C00TableR0"] {
  > div:nth-last-of-type(2) {
    padding-right: 1%;
    width: fit-content !important;
  }
  > div:first-of-type {
    width: 38% !important;
    min-width: 150px !important;
  }
}

.controlsarrangement {
  .control-button-area {
    justify-content: flex-end !important;
    .col-sm-3 {
      display: none !important;
    }
    .col-sm-9,
    .col-sm-8 {
      display: flex;
      justify-content: flex-end;
    }
  }
  @media screen {
    @media (max-width: 460px) {
      & .control-button-area {
        display: flex;
        justify-content: flex-end !important;
        padding-top: 25px !important;
      }
    }
    @media (max-width: 620px) {
      & .control-button-area {
        display: flex;
        justify-content: flex-end !important;
        padding-top: 25px !important;
      }
    }
  }
}

.control-button-area {
  .col-md-9 {
    display: flex !important;
    justify-content: end !important;
  }
}

.alert {
  margin-bottom: 0px !important;
}

#ctl00_ContentPlaceHolder1_btnCancel,
#ctl00_ContentPlaceHolder1_nbbtCancel {
  margin-left: 10px;
}

#ctl00_ContentPlaceHolder1_labCaptchaValidationMsg {
  &:not([style*="display:none;"]) {
    max-width: 200px !important;
    display: flex !important;
    padding-left: 0 !important;
    height: fit-content !important;
  }
}

#subPageHiddenRow[style="visibility: hidden;"] {
  display: none !important;
}
 

.wizardpage-content-data{
  > br{
    display: none;
  }
}

#ctl00_ContentPlaceHolder1_RowSetAssignedUserViewHeader{
  display: none !important;
}

.alert-introduction-panel-cell {
  margin-left: 0px !important;
  justify-content: center;
  display: flex;

  div.alert-introduction-text {
    text-align: center;
  }
}

.wizardpage-button-row {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  padding-top: 10px;
  @media screen {
    @media (max-device-width: 667px) and (orientation: landscape) {
      & {
        text-align: left;
        padding-bottom: 0px !important;
      }
    }
  }
}

.wizard-icon-action-unlockaccount {
  background-color: transparent;
  background-image: none !important;
  &::before {
    display: flex;
    font-family: "FontAwesome";
    content: "\f09c";
    font-size: 28px;
    line-height: 64px;
    width: 79px;
    justify-content: center;
  }
  @media screen {
    @media (max-width: 480px) {
      &::before {
        font-size: 23px;
        line-height: 50px;
        width: 59px;
      }
    }
  }
}

.wizard-icon-action-resetpassword {
  background-color: transparent;
  background-image: none !important;
  &::before {
    display: flex;
    font-family: "FontAwesome";
    content: "\f2f9";
    font-size: 30px;
    line-height: 64px;
    width: 79px;
    justify-content: center;
  }
  @media screen {
    @media (max-width: 480px) {
      &::before {
        font-size: 25px;
        line-height: 50px;
        width: 59px;
      }
    }
  }
}

.wizard-icon-action-changepassword {
  background-color: transparent;
  background-image: none !important;
  &::before {
    display: flex;
    font-family: "Custom";
    content: "\e901";
    font-size: 35px;
    line-height: 64px;
    width: 79px;
    justify-content: center;
  }
  @media screen {
    @media (max-width: 480px) {
      &::before {
        font-size: 30px;
        line-height: 50px;
        width: 59px;
      }
    }
  }
}

#ctl00_ContentPlaceHolder1_divMessageBoxBootstrapInline {
  list-style: none !important;
  margin-top: 0px;
  margin-bottom: 10px;
  .messagebox-bootstrap-Inline-MessageCellOuter {
    width: 100%;
  }
}

#ctl00_ContentPlaceHolder1_divMessageBoxBootstrap {
  min-height: auto !important;
  padding-top: 1rem !important;
  @media screen {
    @media (max-width: 620px) {
      & {
        padding: 0.5rem !important;
        padding-top: 0.5rem !important;
      }
    }
  }
}

form[action="./IdentifyUser.aspx"] {
  .alert-introduction-panel {
    margin-bottom: 0px !important;
  }
  #ctl00_HeadingTrackInfo {
    display: none !important;
  }
}

#ctl00_masterPage #ctl00_ContentPlaceHolder1_subPageR12 div.control-label {
  padding-top: 0px !important;
}

#ctl00_ContentPlaceHolder1_subPageR13 {
  display: flex;
  flex-direction: row;
  &:has(.TOTPAuthenticatorQRCode) {
    justify-content: center;
    flex-direction: column;
    align-items: center !important;
    .control-label {
      width: 100% !important;
      margin-right: 0px !important;
      padding-right: 0px !important;
      display: flex;
      justify-content: center;
    }
  }
}

#ctl00_ContentPlaceHolder1_subPageR11 {
  display: flex;
  flex-direction: row;
}

.col-sm-9:has(#ctl00_ContentPlaceHolder1_tboxPassword) {
  padding: 0px !important;
  max-width: 200px !important;
}

.wizard-button-content-line,
.wizard-button-content-authentication {
  display: none;
}

#ctl00_ContentPlaceHolder1_subPageR16 {
  display: flex;
  justify-content: center;
  @media screen {
    @media (max-width: 620px) {
      display: flex;
      align-items: center !important;
      flex-direction: column;
      margin-left: 0px !important;
    }
  }
}

#ctl00_ContentPlaceHolder1_subPageR15 {
  div:nth-child(2) {
    padding-left: 14px;
    #ctl00_ContentPlaceHolder1_tboxOTP {
      margin-left: 0px;
    }
  }
}

.fade:not(.show) {
  opacity: 1 !important;
}

form[action="./Message.aspx"] #ctl00_HeadingTrackInfo {
  display: none !important;
}

form[action="./AuthenticateChallengeResponse.aspx"] {
  #ctl00_HeadingTrackInfo {
    display: none !important;
  }
  .control-label {
    margin-top: 0px !important;
  }
}

form[action="./AuthenticateSmsPin.aspx"] {
  #ctl00_HeadingTrackInfo {
    display: none !important;
  }
  #subPageR11C01,
  #subPageR10C01 {
    margin-top: 0px !important;
  }
}

form[action="./AuthenticateTOTPAuthenticator.aspx"] #ctl00_HeadingTrackInfo {
  display: none !important;
}

form[action="./AuthenticateEmailPin.aspx"] {
  div.col-sm-3.control-label:not([id]) {
    min-width: 150px;
  }
  div.col-sm-9:not([id]) {
    max-width: 200px;
  }
  .form-control:focus {
    border-color: #dbdcdd !important;
  }
}

#div2 {
  display: block !important;
  .row {
    padding-left: 0px !important;
    padding-right: 0px !important;
  }
}

#ctl00_ContentPlaceHolder1_RowComments {
  display: flex !important;
}

#ctl00_ContentPlaceHolder1_RowRequestInputHeader {
  display: none !important;
}

#ctl00_ContentPlaceHolder1_tboxComments {
  min-width: revert !important;
  max-height: none !important;
  min-height: 40px !important;
}

#divExtraInfoBox {
  padding: 0px !important;
  margin-bottom: 10px !important;
}

form[action="./AuthenticateIdentityVerification.aspx"] {
  #divExtraInfoBox {
    padding: 10px !important;
    min-height: fit-content !important;
    span {
      padding: 0px !important;
    }
  }
  #ctl00_ContentPlaceHolder1_RowTransactions
    [class="col-sm-12 identity-verification-page-datatable-container"] {
    margin: 10px 0px 0px 0px !important;
  }
  #ctl00_ContentPlaceHolder1_RowTransactions #divTransactionTable {
    display: flex;
    justify-content: center;
  }
}

#identity-verification-page-datatable-row {
  margin: 2.5px 0px !important;
}

.container-horizontalline {
  display: flex;

  .col-sm-3,
  .col-sm-1 {
    width: 15% !important;
  }
  .col-sm-8 {
    width: 70%;
  }
}

.control-button-area {
  .col-sm-1 {
    display: none !important;
  }
  @media screen {
    @media (max-width: 1000px) {
      & {
        text-align: left !important;
      }
    }
    @media (min-width: 620px) {
      & {
        text-align: left;
        padding-top: 20px !important;
      }
    }
  }
  .col-sm-9 {
    width: 100% !important;
  }
}

[id*="_labQuestionTitle"] {
  margin-top: 2px;
}

form[action="./ChangePassword.aspx"] {
  .form-group {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: center;
    margin-top: 10px;
  }
  .control-label {
    margin-top: 0px !important;
    min-width: 154px !important;
  }
  .form-group.control-button-area {
    justify-content: revert !important;
    .col-sm-9 {
      width: 100%;
    }
  }
}

.control-required-field-validator:not([style*="none"]) {
  max-width: 200px !important;
  display: flex !important;
  padding-left: 0 !important;
  height: fit-content !important;
}

#ctl00_ContentPlaceHolder1_divPasswordComplexityIndicator {
  padding: 0;
  justify-content: center;
  margin-top: 25px;
  .control-label {
    display: none;
  }
  @media screen {
    @media (max-width: 620px) {
      & {
        margin-top: 15px !important;
      }
    }
  }
}

#PasswordComplexityIndicator {
  background-color: transparent !important;
  display: flex;
  flex-direction: column;
  padding-left: 35px !important;
  padding: 5px;
  border: 1px solid transparent !important;
  border-radius: 4px !important;
  p {
    width: 705px;
    margin: 2px 0px;
    align-items: center;
    padding-left: 0px;
  }
  p[id=""] {
    display: none !important;
  }
}

.complexityindicator-subrequirement-ok {
  background-image: none !important;
  &:before {
    font-family: "FontAwesome";
    content: "\f00c";
    position: relative;
    left: -20px;
    font-size: 12px;
  }
}

.complexityindicator-mainrequirement-ok {
  background-image: none !important;
  &::before {
    font-family: "FontAwesome";
    content: "\f00c";
    position: relative;
    left: -20px;
    font-size: 12px;
  }
}

.complexityindicator-subrequirement-maybeok {
  background-image: none !important;
  &::before {
    font-family: "fontAwesome";
    content: "\1f7e4";
    position: relative;
    left: -20px;
    font-size: 7px;
  }
}

.complexityindicator-mainrequirement-notok {
  background-image: none !important;
  &::before {
    font-family: "FontAwesome";
    content: "\1f5d9";
    position: relative;
    left: -20px;
    font-size: 12px;
  }
}

form[action="./ResetPassword.aspx"] {
  .form-group:has(input) {
    display: flex !important;
    margin-bottom: 10px !important;
    justify-content: center;
    .control-label {
      width: 160px !important;
    }
    .col-sm-9 {
      width: fit-content !important;
    }
  }
  #ctl00_ContentPlaceHolder1_divPasswordComplexityIndicator {
    display: flex !important;
    .col-sm-9 {
      width: 90% !important;
    }
  }
}

form[action="./RegisterTOTPAuthenticator.aspx"] {
  #ctl00_ContentPlaceHolder1_subPageR15 {
    display: flex !important;
    margin-top: 10px;
    align-items: flex-start !important;
  }
  #ctl00_ContentPlaceHolder1_subPageR16 {
    margin-top: 10px !important;
    .control-label {
      display: none !important;
    }
  }
  #ctl00_ContentPlaceHolder1_subPageR10,
  #ctl00_ContentPlaceHolder1_subPageR11,
  #ctl00_ContentPlaceHolder1_subPageR12 {
    .control-label {
      margin-top: 0px !important;
    }
  }
  #ctl00_ContentPlaceHolder1_subPageR13,
  #ctl00_ContentPlaceHolder1_subPageR15 {
    .control-label {
      margin-top: 5px !important;
    }
  }
  &.masterpage-main-inner-top-cell2-label {
    display: none !important;
  }
}

#ctl00_ContentPlaceHolder1_chkboxSkipEnrollmentAction {
  accent-color: var(--p-btn-bg-color);
}

#ctl00_ContentPlaceHolder1_TOTPAuthenticatorQRCodeControl {
  padding-left: 20px;
  @media screen {
    @media (max-width: 620px) {
      & {
        padding-left: 0px !important;
      }
    }
  }
}

.TOTPAuthenticatorQRCode {
  margin-top: 10px !important;
  position: static;
  width: 100% !important;
  @media screen {
    @media (max-width: 620px) {
      & {
        margin-top: 0px !important;
      }
    }
  }
}

[id*="ctl00_ContentPlaceHolder1_rptRegChallengeResponse"] {
  &[id*="_Line"] {
    flex-direction: row !important;
    width: 100%;
    justify-content: center;
  }
  .col-sm-1 {
    display: none !important;
  }
}



#ctl00_ContentPlaceHolder1_subPageR02C00TableR02 {
  align-items: center;
  div:first-of-type {
    margin-top: 0px !important;
  }
}

#ctl00_ContentPlaceHolder1_txtPrimaryMobileNumber,
#ctl00_ContentPlaceHolder1_txtPrimaryEmailAddress,
#ctl00_ContentPlaceHolder1_txtAlternateEmailAddress {
  max-width: 200px !important;
}

.registeruserinformation-verificationdiv {
  display: flex;
  align-items: center;
  padding-left: 0px !important;

  [style="visibility: hidden;"] {
    display: none !important;
  }
}

.modal-header {
  display: block !important;
}

.modal-title {
  text-align: center !important;
  @media screen {
    @media (max-width: 620px) {
      & {
        font-size: 16px !important;
      }
    }
  }
}

#divPrimaryMobileNumber {
  display: flex;
  flex-direction: column;
  align-items: center;
  .control-label {
    margin: 0 !important;
  }
  .col-sm-3.control-label {
    margin-bottom: 5px !important;
  }
  .control-value-popup {
    width: fit-content !important;
  }
}

#divPrimaryEmailAddress {
  display: flex;
  flex-direction: column;
  align-items: center;
  .control-label {
    margin: 0 !important;
  }
  .col-sm-3.control-label {
    margin-bottom: 5px !important;
  }
  .control-value-popup {
    width: fit-content !important;
  }
}

#divChallenge {
  display: flex;
  flex-direction: column;
  align-content: center;
  margin-top: 10px !important;
  align-items: center;
  .control-label {
    margin: 0 !important;
  }
  .col-sm-3.control-label {
    margin-bottom: 5px !important;
    justify-content: center;
  }
  .col-sm-9 {
    width: fit-content !important;
    input {
      width: 200px !important;
    }
  }
}

.divmsg {
  display: none !important;
}

#ctl00_BlockingLayer::after {
  font-family: "bootstrap-icons";
  content: " \f659";
  font-size: 25px;
  color: #ff00006b;
  font-weight: bold;
  position: absolute;
  right: 7.2px;
  top: 2px;
  line-height: 35px;
}

#butBlockingLayerCancel {
  border-radius: 20px;
  background-color: rgb(255 255 255 / 21%);
  color: transparent !important;
  &:focus {
    box-shadow: none !important;
  }
}

.wizard-icon-action-connectidentityverification {
  background-image: none !important;
  &::before {
    display: flex;
    font-family: "Custom";
    content: "\e904";
    font-size: 30px;
    line-height: 64px;
    width: 79px;
    justify-content: center;
  }
  @media screen {
    @media (max-width: 480px) {
      &::before {
        font-size: 25px;
        line-height: 50px;
        width: 59px;
      }
    }
  }
}

.wizard-icon-authentication-totpauthenticator {
  &::before {
    display: flex;
    font-family: "Custom";
    content: "\e900";
    font-size: 30px;
    line-height: 64px;
    justify-content: center;
    text-decoration-style: dashed;
    text-decoration-line: underline;
    text-underline-offset: 7px;
    text-decoration-thickness: from-font;
  }
  @media screen {
    @media (max-width: 480px) {
      &::before {
        font-size: 25px;
        line-height: 50px;
      }
    }
  }
}

.wizard-icon-authentication-smspin {
  &::before {
    display: flex;
    font-family: "FontAwesome";
    content: "\f7cd";
    font-size: 30px;
    line-height: 64px;
    justify-content: center;
  }
  @media screen {
    @media (max-width: 480px) {
      &::before {
        font-size: 25px;
        line-height: 50px;
      }
    }
  }
}

.wizard-icon-authentication-chalrespsemiprivate {
  &::before {
    display: flex;
    font-family: "FontAwesome";
    content: "\f059";
    font-size: 30px;
    line-height: 64px;
    justify-content: center;
  }
  @media screen {
    @media (max-width: 480px) {
      &::before {
        font-size: 25px;
        line-height: 50px;
      }
    }
  }
}

.wizard-icon-authentication-chalrespprivate {
  &::before {
    display: flex;
    font-family: "FontAwesome";
    content: "\f06a";
    font-size: 30px;
    line-height: 64px;
    justify-content: center;
  }
  @media screen {
    @media (max-width: 480px) {
      &::before {
        font-size: 25px;
        line-height: 50px;
      }
    }
  }
}

.wizard-icon-authentication-codecard {
  &::before {
    display: flex;
    font-family: "bootstrap-icons";
    content: "\f228";
    font-size: 30px;
    line-height: 64px;
    justify-content: center;
  }
  @media screen {
    @media (max-width: 480px) {
      &::before {
        font-size: 25px;
        line-height: 50px;
      }
    }
  }
}

.Mandatory {
  background-image: none !important;
  margin: 0px !important;
  padding: 0px !important;
  justify-content: center;
  align-content: center;
  flex-wrap: wrap;

  &::after {
    font-family: "bootstrap-icons";
    content: " \F332";
    font-size: 20px;
    position: relative;
    width: 0px;
  }
}

.Ok {
  background-image: none !important;
  margin: 0px !important;
  padding: 0px !important;
  justify-content: center;
  align-content: center;
  flex-wrap: wrap;
  margin-left: 5px !important;
  margin-right: 5px !important;
  &::after {
    font-family: "bootstrap-icons";
    content: " \F633";
    font-size: 26px;
    color: green;
    font-weight: 600;
  }
}

.NotOk {
  background-image: none !important;
  margin: 0px !important;
  padding: 0px !important;
  justify-content: center;
  align-content: center;
  flex-wrap: wrap;
  margin-left: 11px !important;
  margin-right: 5px !important;
  &::after {
    font-family: "bootstrap-icons";
    content: " \F659";
    font-size: 20px;
    color: red;
    font-weight: 600;
  }
}

.lang-Select {
  position: relative;
  font-family: Arial;
  select {
    display: none;
  }
  @media screen {
    @media (min-width: 750px) and (max-width: 900px) {
      &,
      & div {
        width: fit-content !important;
      }
    }
    @media (max-width: 750px) {
      & {
        position: absolute;
        z-index: 200;
        top: 22px;
        right: 10%;
        width: 0px;
        height: 0px;
      }
    }
  }
}

.custom-select {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 40px;

  .col-sm-8:has(&) {
    margin-top: 10px !important;
  }
  select {
    display: none;
  }
  @media screen {
    @media (min-width: 750px) and (max-width: 900px) {
      .masterpage-header div:not(&) {
        width: 180px !important;
        margin: 0px;
      }
      &,
      & div {
        margin: 0px;
      }
    }
  }
}

.lang-Select-Selected {
  background-color: white !important;
  display: flex;
  align-items: center;
  border-radius: 4px;
  border-color: transparent transparent rgba(0, 0, 0, 0.1) transparent;
  width: 180px;
  color: var(--detail-font-color);
  padding: 8px 16px;
  border: 1px solid transparent;
  cursor: pointer;
  text-align: justify;
  @media screen {
    @media (max-width: 750px) {
      & {
        position: absolute;
        right: 0px;
        margin: 9px 0 0;
        height: 50px !important;
        padding: 0px !important;
        border: none !important;
        width: 26px !important;
        border-radius: 0px;
        background-color: transparent !important;
        top: -7px;
      }
      &:before {
        content: "";
        position: absolute;
        left: 0;
        width: 26px;
        height: 3px;
        background: #1b1d21;
        margin: -16px 0 0;
      }
      &:after {
        content: "";
        position: absolute;
        left: 0;
        width: 26px;
        height: 3px;
        background: #1b1d21;
        margin: 16px 0 0;
      }
    }
  }
}

.lang-Items {
  position: absolute;
  background-color: white;
  top: 100%;
  right: 0;
  z-index: 99;
  overflow: auto;
  max-height: 300px;
  margin-top: 5px;
  padding: 10px;
  min-width: 180px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  div {
    color: var(--detail-font-color);
    padding: 8px 16px;
    border: 1px solid transparent;
    cursor: pointer;
    text-align: justify;
  }
  .lang-Selected {
    background-color: rgba(0, 0, 0, 0.1);
    border-radius: 4px;
    pointer-events: none;
  }
  &::-webkit-scrollbar {
    display: none !important;
  }
  div:hover {
    background-color: rgba(0, 0, 0, 0.1);
    border-radius: 4px;
  }
  @media screen {
    @media (max-width: 750px) {
      & {
        position: absolute;
        top: 26px;
        right: -23px;
        z-index: 99;
        overflow: auto;
        max-height: 150px;
        margin-top: 5px;
        padding: 10px;
        min-width: 180px;
      }
    }
    @media (max-width: 620px) {
      div {
        font-size: 12px !important;
        font-weight: 400;
      }
      & {
        right: -17px;
      }
    }
  }
}

.lang-Select-Hide,
.select-hide {
  display: none;
}

.lang-same-as-selected {
  background-color: rgba(0, 0, 0, 0.1);
  border-radius: 4px;
}

.shortened-language {
  display: none;
}

.small-Logo {
  display: none;
  @media screen {
    @media (max-width: 620px) {
      & {
        display: block;
      }
    }
  }
}

#ctl00_divATSupport {
  display: none !important;
}

#divMessageBoxBootstrapInlineButtonRow {
  justify-content: flex-end !important;
  .col-sm-12 {
    width: fit-content !important;
  }
}

.shift-Down {
  padding-top: 40px !important;
}

.identity-verification-page-datatable-text-indent {
  padding: 0px !important;
}

#imgExtraInfo {
  position: absolute;
  bottom: -24px;
  right: 50%;
}

#ctl00_ContentPlaceHolder1_nbbtnContinue:disabled {
  display: none !important;
}

#ctl00_ContentPlaceHolder1_subPageR14[style="visibility:hidden;display:none;"] {
  display: none !important;
}

.select-selected {
  display: block;
  width: 100%;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  background-clip: padding-box;
  border: 2px solid #dbdcdd;
  max-width: 400px !important;
  border-radius: 0.25rem;
  text-align: center;
  &:hover {
    cursor: pointer;
  }
  @media screen {
    @media (max-width: 620px) {
      & {
        max-width: 300px !important;
      }
    }
  }
}

.select-items {
  width: 100%;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: var(--font-color);
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  max-width: 400px !important;
  border-radius: 0.25rem;
  position: relative;
  margin-top: 5px !important;
  max-height: 170px;
  overflow: scroll;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px,
    rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
  div {
    width: 100%;
    padding: 0.25rem 0.75rem;
    margin: 0.125rem 0rem;
    font-size: 0.8125rem;
    font-weight: 400;
    line-height: 1.5;
    color: #212529;
    background-color: #fff;
    background-clip: padding-box;
    max-width: 400px !important;
    border-radius: 0.25rem;
  }
  .same-as-selected {
    background-color: #ced4da !important;
  }
  .select-item:hover {
    cursor: pointer;
    background-color: #ced4da !important;
  }
  @media screen {
    @media (max-width: 620px) {
      & {
        max-width: 300px !important;
      }
    }
  }
}

[class*="select-dropdown"] {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: absolute;
  margin-left: 5% !important;
  margin-right: 5% !important;
  padding-left: calc(var(--bs-gutter-x) * 0.5 + 20px);
  padding-right: calc(var(--bs-gutter-x) * 0.5 + 20px);
  &:has(.select-arrow-active) {
    z-index: 100;
  }
  @media screen {
    @media (max-width: 480px) {
      & {
        padding-left: calc(var(--bs-gutter-x) * 0.5 + 27px) !important;
        padding-right: calc(var(--bs-gutter-x) * 0.5 + 27px) !important;
      }
    }
  }
}

#ctl00_ContentPlaceHolder1_ltrPrimaryMobileNumber {
  padding-top: 0px !important;
}

[id*="VerificationStatusImage"],
[id*="IsMandatoryImage"] {
  width: fit-content !important;
}

[class*="content-wrapper"] {
  @media screen {
    @media (max-width: 1000px) {
      & {
        display: flex;
        flex-direction: column;
        align-items: center;
      }
    }
    @media (max-width: 460px) {
      .alert-danger {
        margin-bottom: 10px !important;
      }
    }
  }
}

.identity-verification-page-attention {
  top: 32px !important;
}

.control-text-captcha::placeholder {
  text-transform: none !important;
}

.content-wrapper-Change-Password .alert-introduction-text {
  padding-bottom: 25px !important;
}

#ctl00_ContentPlaceHolder1_labOTPTitle {
  padding-top: 5px !important;
}

.alert-success,
.alert-info {
  background-color: var(--button-bordered-bg) !important;
  color: var(--detail-font-color) !important;
  border-color: transparent !important;
  text-align: left !important;
  display: flex;
  justify-content: flex-start;
}

.complexityindicator-subrequirement {
  padding-left: 21px !important;
  width: 100% !important;
  max-width: 700px !important;
  &.complexityindicator-subrequirement-maybeok::before {
    font-size: 6px !important;
    width: 0px;
    display: flex;
    top: 5px;
    height: 0px;
  }
  .complexityindicator-subrequirement-ok::before {
    height: 0px;
    width: 0px;
    display: flex;
  }

  @media screen {
    @media (max-width: 1000px) {
      & {
        padding-left: 30px !important;
        width: 80% !important;
      }
      &.complexityindicator-subrequirement-maybeok::before {
        left: -10px;
      }
      .complexityindicator-subrequirement-ok::before {
        left: -10px;
      }
    }
  }
}

.complexityindicator-mainrequirement-notok {
  &::before {
    height: 0px;
    width: 0px;
    display: flex;
  }
  @media screen {
    @media (max-width: 1000px) {
      &::before {
        left: -10px;
      }
    }
  }
}

.complexityindicator-mainrequirement-ok {
  &::before {
    height: 0px;
    width: 0px;
    display: flex;
  }

  @media screen {
    @media (max-width: 1000px) {
      &::before {
        left: -10px;
      }
    }
  }
}

div:has(> #ctl00_ContentPlaceHolder1_labQRCodeTitle) {
  position: relative;
  top: 3px;
  height: 0px;
  @media screen {
    @media (max-width: 620px) {
      & {
        top: -2px !important;
      }
    }
  }
}

#ctl00_ContentPlaceHolder1_txtPrimaryEmailAddress,
#ctl00_ContentPlaceHolder1_txtPrimaryMobileNumber {
  margin-right: 5px !important;
  @media screen {
    @media (max-width: 620px) {
      & {
        margin-right: 0px !important;
      }
    }
  }
}

.registeruserinformation-verificationdiv {
  margin-left: 10px !important;
}

/* ? ----------------------------------- Media Controls --------------------------------------------------- */

@media (max-width: 1000px) {
  .content-wrapper-challenge #subPageR10,
  .content-wrapper-challenge [class="form-group"]:has(#subPageR11C01) {
    padding: 0px !important;
    width: 100%;
  }

  .content-wrapper #ctl00_ContentPlaceHolder1_subPageR10,
  .content-wrapper #ctl00_ContentPlaceHolder1_subPageR12 {
    padding: 0px !important;
    width: 100%;
  }

  .content-wrapper-SMS-pin #subPageR11,
  .content-wrapper-SMS-pin > div:last-of-type,
  .content-wrapper-Auth-Password .form-group.row {
    padding: 0px !important;
    width: 100%;
  }

  .content-wrapper-Reg-TOTP #ctl00_ContentPlaceHolder1_subPageR13 {
    flex-direction: column !important;
    margin-left: 0px !important;
  }
  .content-wrapper-Reg-TOTP #ctl00_ContentPlaceHolder1_subPageR16 {
    flex-direction: column !important;
    margin-left: 0px !important;
    align-items: center !important;
  }

  .content-wrapper-Reg-TOTP
    #ctl00_ContentPlaceHolder1_subPageR13
    .control-label {
    width: 100% !important;
    text-align: center !important;
    margin-right: 0px !important;
  }

  .masterpage-main-inner-top-cell2-label {
    text-align: center !important;
  }

  .container-horizontalline {
    width: 100%;
    display: flex;
    justify-content: center;
  }
  .container-horizontalline hr {
    margin: 0px !important;
  }

  .container-horizontalline .col-sm-3,
  .container-horizontalline .col-sm-1 {
    width: 0px !important;
  }

  .container-horizontalline .col-sm-8 {
    width: 90%;
  }

  .content-wrapper-Change-Password #PasswordComplexityIndicator p {
    width: fit-content;
    text-align: left;
    text-indent: -10px;
    padding-left: 10px;
  }

  .content-wrapper-Change-Password .form-group {
    padding-left: 0px !important;
  }

  .content-wrapper-Auth-Password .form-group.row:has(input) {
    align-items: flex-start !important;
  }
}

@media (max-width: 900px) {
  .masterpage-header {
    display: flex;
    justify-content: flex-end;
  }
}

@media (min-width: 900px) and (max-width: 1024px) {
  body {
    padding: 0px 5% !important;
  }

  .masterpage-header {
    display: flex;
    justify-content: flex-end;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
  }
}

@media (min-width: 750px) and (max-width: 900px) {
  .container-fluid,
  .masterpage-header,
  .masterpage-header div {
    width: auto !important;
    margin-left: 5%;
    margin-right: 5%;
  }

  .masterpage-header-center-outer,
  .masterpage-header-center,
  .masterpage-language-outerdiv {
    margin: 0px;
  }

  .masterpage-header-left,
  .masterpage-header-right {
    display: none !important;
  }

  .lang-Selected {
    min-width: 180px !important;
  }

  .wizard-button-content {
    padding: 20px;
  }
}

@media (max-width: 750px) {
  .container-fluid {
    width: auto !important;
    margin-left: 5%;
    margin-right: 5%;
  }

  .masterpage-header {
    height: 0px;
    display: flex;
    justify-content: center;
  }

  .content__main-link h2 {
    line-height: 1;
  }

  .wizard-button-content-warningtext {
    overflow: hidden;
  }

  #ctl00_labelApplicationTitle {
    font-size: 1.125em !important;
    padding: 0px !important;
    font-weight: 400 !important;
  }

  #ctl00_labelSolutionTitle {
    font-size: 0.875em !important;
    padding: 0px !important;
  }

  #SolutionTitle,
  #ApplicationTitle {
    width: fit-content;
  }

  #ApplicationTitle {
    display: flex;
    align-items: center;
  }

  #SolutionTitle {
    display: flex;
    align-items: center;
    margin-top: 5px;
  }

  .lang-Selected .full-language {
    background-color: #1b1d21;
    color: transparent;
    width: 26px;
    height: 3px;
    padding: 0px;
  }

  .full-language {
    color: transparent;
    background-color: black;
    width: 26px;
    height: 3px;
    padding: 0px;
  }

  .wizard-button-content {
    min-height: 90px;
    background-color: #eeeeee;
    padding: 20px;
    border-radius: 6px;
  }

  .wizardpage-content {
    padding-bottom: 0px;
  }

  .masterpage-pageheader-center {
    padding: 5px 50px 5px 5px !important;
  }

  .masterpage-pageheader-center.shift-Left {
    padding: 5px !important;
  }

  #ctl00_labelSolutionTitle {
    font-weight: 700 !important;
  }

  [id*="ctl00_ContentPlaceHolder1_subPageR02C00TableR0"].form-group {
    width: 100%;
    flex-wrap: wrap;
    justify-content: center;
  }

  [id*="ctl00_ContentPlaceHolder1_subPageR02C00TableR0"] > div:first-of-type {
    width: 100% !important;
    text-align: center !important;
    justify-content: center;
  }

  [id*="ctl00_ContentPlaceHolder1_subPageR02C00TableR0"]
    > div:nth-last-of-type(2) {
    display: flex;
    width: 65% !important;
    justify-content: flex-end;
    margin-top: 10px;
  }

  [id*="ctl00_ContentPlaceHolder1_subPageR02C00TableR0"]
    .registeruserinformation-verificationdiv {
    margin-top: 10px;
  }
}

@media (max-device-width: 667px) and (orientation: landscape) {
  #ApplicationTitle {
    font-size: 1em !important;
  }

  #SolutionTitle {
    font-size: 1em !important;
  }

  .column-margin {
    margin: 10px 0 0 0;
  }
}

@media (max-width: 620px) {
  #ctl00_ContentPlaceHolder1_subPageR10,
  #ctl00_ContentPlaceHolder1_subPageR11,
  #ctl00_ContentPlaceHolder1_subPageR12,
  #ctl00_ContentPlaceHolder1_subPageR15,
  .content-wrapper #ctl00_ContentPlaceHolder1_subPageR12,
  #ctl00_ContentPlaceHolder1_subPageR13,
  div[class="form-group row"],
  [id*="ctl00_ContentPlaceHolder1_Row"].form-group.form-group-first-rowme:not(
      [style="display:none;"]
    ) {
    display: flex;
    align-items: center !important;
    flex-direction: column;
    margin-left: 0px !important;
  }

  .content-wrapper-TOTP-auth #ctl00_ContentPlaceHolder1_subPageR10,
  .content-wrapper-TOTP-auth #ctl00_ContentPlaceHolder1_subPageR12,
  .content-wrapper-TOTP-auth #ctl00_ContentPlaceHolder1_subPageR11 {
    display: flex;
    align-items: center !important;
    flex-direction: column;
    margin-left: 0px !important;
    width: 100%;
  }

  .content-wrapper-SMS-pin #subPageR11,
  .content-wrapper-SMS-pin > div:last-of-type {
    display: flex !important;
    align-items: center !important;
    flex-direction: column;
    margin-left: 0px !important;
    width: 100%;
  }

  .content-wrapper-SMS-pin .form-group .col-sm-9 {
    justify-content: center;
    display: flex;
    align-items: center;
    flex-direction: column;
    flex-wrap: wrap;
    padding-left: 0px !important;
  }

  .content-wrapper-SMS-pin .col-sm-3.control-label {
    margin: 0px !important;
    text-align: center !important;
  }

  .content-wrapper-TOTP-auth
    #ctl00_ContentPlaceHolder1_subPageR10
    .control-label,
  .content-wrapper-TOTP-auth
    #ctl00_ContentPlaceHolder1_subPageR12
    .control-label,
  .content-wrapper-TOTP-auth
    #ctl00_ContentPlaceHolder1_subPageR11
    .control-label {
    min-width: 90px;
    text-align: center !important;
  }

  .content-wrapper-TOTP-auth
    #ctl00_ContentPlaceHolder1_subPageR13
    .control-label {
    width: 100% !important;
    text-align: center !important;
  }

  .content-wrapper .control-label {
    width: 100% !important;
    margin-right: 0px !important;
    text-align: center !important;
    padding-bottom: 10px !important;
  }

  .content-wrapper-TOTP-auth .control-label {
    margin-right: 0px !important;
    padding-bottom: 0px !important;
  }

  #subPageR11C02 {
    padding-left: 0px !important;
    text-align: center;
  }

  [id*="tbox"] {
    width: 180px !important;
  }

  .captcha-imagespacer,
  .captcha-imagespacer ~ div {
    display: flex;
    justify-content: center;
  }

  #ctl00_ContentPlaceHolder1_labCaptchaValidationMsg:not(
      [style*="display:none;"]
    ) {
    max-width: 180px !important;
  }

  #ctl00_ContentPlaceHolder1_tboxOTP {
    margin-left: 0px;
  }

  .content-wrapper-challenge #subPageR10,
  .content-wrapper-challenge [class="form-group"]:has(#subPageR11C01) {
    padding: 0px !important;
    width: 100%;
    margin-left: 0%;
    align-items: center !important;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: center;
  }

  .btn-primary,
  .btn-default {
    font-size: 0.75em !important;
    font-weight: 400 !important;
  }

  #subPageR11C03 {
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
  }

  .content-wrapper-challenge #subPageR11C01,
  #subPageR10 .control-label {
    text-align: center !important;
    margin-right: 0px !important;
  }

  .content-wrapper-Change-Password .form-group {
    flex-direction: column !important;
    align-content: center !important;
    align-items: center !important;
    width: 100%;
  }

  .content-wrapper-Change-Password .col-sm-3.control-label {
    width: 100% !important;
    margin: 0px !important;
    text-align: center !important;
    justify-content: center;
  }

  .control-label > span,
  .form-group:has(input) .control-label > span {
    padding-top: 0px !important;
  }

  .content-wrapper-Auth-Password .form-group.row {
    flex-direction: column !important;
    flex-wrap: wrap !important;
    align-content: center !important;
    margin-left: 0px !important;
  }

  .content-wrapper-Auth-Password .form-group.row .control-label {
    margin: 0px !important;
    width: fit-content !important;
    text-align: center !important;
  }

  .form-group:has(#ctl00_ContentPlaceHolder1_tboxPassword) .control-label {
    width: 100% !important;
  }

  .form-group:has(#ctl00_ContentPlaceHolder1_tboxPassword) .col-sm-9 {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    padding: 0px !important;
    width: 100% !important;
  }

  [id*="ctl00_ContentPlaceHolder1_Row"].form-group.form-group-first-rowme:not(
      [style="display:none;"]
    )
    .control-label {
    margin-right: 0px !important;
    width: 100% !important;
    display: flex;
    justify-content: center;
  }

  #subPageR10 #subPageR10C03,
  .form-group #subPageR11C02,
  .form-group:has(#ctl00_ContentPlaceHolder1_tboxSmsChallCode)
    > div:last-of-type,
  [id*="ctl00_ContentPlaceHolder1_Row"].form-group.form-group-first-rowme:not(
      [style="display:none;"]
    )
    > div:last-of-type {
    padding-left: 0px !important;
    padding-right: 0px !important;
    display: flex;
    width: 100% !important;
    flex-direction: column;
    align-items: center;
  }

  .content-wrapper-SMS-pin #subPageR11,
  .content-wrapper-SMS-pin > div:last-of-type,
  .content-wrapper-Auth-Password .form-group.row {
    padding: 0px !important;
    width: fit-content !important;
  }

  [id*="ctl00_ContentPlaceHolder1_Row"].form-group.form-group-first-rowme:not(
      [style="display:none;"]
    )
    > div:last-of-type
    .control-with-validator {
    position: relative;
    right: -84px;
    top: -4.5em;
  }

  .content-wrapper-Reg-TOTP .control-label {
    margin: 0px !important;
    display: flex;
    justify-content: center;
  }

  [id*="ctl00_ContentPlaceHolder1_subPageR02C00TableR0"] > div:first-of-type {
    width: 100% !important;
    text-align: center !important;
    margin-right: 0px !important;
  }

  [id*="ctl00_ContentPlaceHolder1_subPageR02C00TableR0"]
    > div:nth-last-of-type(2) {
    width: 100% !important;
    justify-content: center;
    padding: 0px !important;
  }

  [id*="ctl00_ContentPlaceHolder1_subPageR02C00TableR0"] > div:last-of-type {
    flex-wrap: wrap;
    flex-direction: row !important;
    width: 200px !important;
  }

  .control-label {
    justify-content: center !important;
  }

  .content-wrapper #ctl00_ContentPlaceHolder1_subPageR12 .col-sm-9 > div {
    width: 100% !important;
  }

  .wizard-button-content-headertext,
  .control-label,
  #ctl00_ContentPlaceHolder1_divMessageBoxBootstrapInlineBody {
    font-size: 14px !important;
  }

  .wizard-button-content-detailtext p,
  .alert-introduction-text {
    font-size: 13px !important;
  }

  #ctl00_labelTrackName,
  #ctl00_ContentPlaceHolder1_labHeadingStep {
    font-size: 18px !important;
  }

  [id*="tbox"],
  #ctl00_ContentPlaceHolder1_labCaptchaValidationMsg {
    width: 100% !important;
    max-width: 200px !important;
    height: 35px !important;
    font-size: 13px !important;
  }

  .alert {
    font-size: 0.875em !important;
  }

  .content-wrapper-Change-Password .alert-introduction-text {
    padding-bottom: 15px !important;
  }

  .icon-MypassFavicon {
    &::before {
      font-family: "Custom";
      content: "\e908";
      font-size: 33px;
      color: #e22e38;
      line-height: 36px;
    }
    @media screen {
      @media (max-width: 380px) {
        &::before {
          position: relative;
          left: 20%;
        }
      }
    }
  }
  .icon-MypassFavicon {
    width: -webkit-fill-available;
    display: flex;
    padding: 0px;
    justify-content: center;
  }

  .registeruserinformation-verificationdiv {
    justify-content: center;
    margin-left: 0px !important;
  }
}

@media (min-width: 576px) {
  .col-sm-9 {
    flex: 0 0 auto;
    width: -webkit-fill-available !important;
  }
  .col-sm-8 {
    flex: 0 0 auto;
    width: 100%;
  }

  .content-wrapper-Change-Password .col-sm-9,
  .content-wrapper-Auth-Password .col-sm-9 {
    flex: 0 0 auto;
    width: -webkit-fill-available !important;
  }
}

@media (max-width: 480px) {
  .wizard-button-content {
    padding: 10px !important;
  }

  [id*="ctl00_ContentPlaceHolder1_Row"].form-group.form-group-first-rowme:not(
      [style="display:none;"]
    )
    > div:last-of-type
    .control-with-validator {
    position: relative;
    right: -70px;
    top: -4em;
  }

  .identity-verification-page-datatable {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .identity-verification-page-datatable-row-item-padding-10 {
    padding: 0px !important;
    width: 20%;
  }

  .identity-verification-page-datatable-row-item-padding-40 {
    padding: 0px !important;
    width: 80%;
  }

  .identity-verification-page-datatable-row {
    display: flex;
    width: 100%;
  }
}

@media (max-width: 480px) and (orientation: portrait) {
  #ApplicationTitle {
    font-size: 1em !important;
  }

  #SolutionTitle {
    font-size: 1em !important;
  }

  .control-label span {
    padding-left: 0px !important;
  }

  .col-sm-6.column-margin {
    margin: 0px;
    text-align: left;
  }
}

@media (max-width: 460px) {
  .wizard-button-content-detailtext,
  .wizard-button-content-headertext {
    width: auto !important;
    text-align: center;
  }

  .wizard-button-content-cell2 {
    margin-top: 10px !important;
  }
}

[style="visibility:hidden;display:none;"] {
  display: none !important;
}

.container-horizontalline-value {
  display: none !important;
}

.popuppage-content-data {
  margin: 0px !important;
  padding: 0px !important;
  width: auto !important;
  margin-left: 5% !important;
  margin-right: 5% !important;
  margin-top: 32px !important;
}

.wizard-button-content-line-wide {
  border-bottom-color: transparent !important;
}

.control-label-colon {
  display: none !important;
}

.captcha-imagespacer{
  img{
    width: 200px !important;
  }
}

form[action="./AuthenticateHelpDeskPin.aspx"]{
  .form-group{
    &.control-button-area {
      @media (max-width: 620px) {
        width: -webkit-fill-available !important;
        padding-top: 25px !important;
      }
    }
    @media (max-width: 620px){
        flex-direction: column !important;
        flex-wrap: wrap !important;
        align-content: center !important;
        margin-left: 0px !important;
        padding: 0px !important;
        width: fit-content !important;
        align-items: center !important;
    }
    .control-label{
      @media (max-width: 620px) {
        margin: 0px !important;
        width: fit-content !important;
        text-align: center !important;
      }
    }
    .control-value{
      max-width: 200px !important;

    }
    .col-sm-9{
      &:has(#ctl00_ContentPlaceHolder1_tboxPin){
        padding: 0px !important;
        max-width: 200px !important;
        @media (max-width: 620px){
          display: flex !important;
          flex-direction: column !important;
          align-items: center !important;
          padding: 0px !important;
          width: 100% !important;
        }
      }
      @media (min-width: 576px) {
        flex: 0 0 auto;
        width: -webkit-fill-available !important;
      }
    } 
  }
  .controlsarrangement  {
    @media (max-width: 620px){
      display: flex;
    flex-direction: column;
    align-items: center;
    }
  }
}

@media (max-width: 780px){
  .shift-Down {
    padding-top: 10px !important;
  }
}

form[action="./AuthenticatePassword.aspx"], form[action="./AuthenticateHelpDeskPin.aspx"], form[action="./AuthenticateEmailPin.aspx"] {
  .col-lg-9.control-value:has(#ctl00_ContentPlaceHolder1_labUserId), 
  .col-lg-9.control-value:has(#ctl00_ContentPlaceHolder1_labDomainName),
  .col-md-9:has(#ctl00_ContentPlaceHolder1_tboxPassword),
  .col-md-9:has(#ctl00_ContentPlaceHolder1_tboxPin),
  #ctl00_ContentPlaceHolder1_subPageR10, #subPageR11 {
    width: fit-content;
    padding: 0px !important;
    @media (max-width: 620px) {
        width: 100% !important;  
    }
  }

  .col-md-9:has(#ctl00_ContentPlaceHolder1_tboxPassword),
  .col-md-9:has(#ctl00_ContentPlaceHolder1_tboxPin) {
    padding: 0px !important;
    @media (max-width: 620px) {
      display: flex;
      justify-content: center;  
    }
  }

  #ctl00_ContentPlaceHolder1_labPassword,  #ctl00_ContentPlaceHolder1_tboxPin {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
  }

  .mb-3:has(#ctl00_ContentPlaceHolder1_labUserId),
  .mb-3:has(#ctl00_ContentPlaceHolder1_labDomainName),
  .mb-3:has(#ctl00_ContentPlaceHolder1_labPassword),
  .mb-3:has(#ctl00_ContentPlaceHolder1_labPin),
  #ctl00_ContentPlaceHolder1_subPageR10, #subPageR11 {
    display: flex !important;
    margin-bottom: 10px !important;
    @media (max-width: 1000px) {
      width: 100% !important;  
    } 
    .col-md-3, #subPageR11C01, #subPageR10C01 {
      width: 45% !important;
      @media (max-width: 620px) {
        width: 100% !important;  
      }
    }
  }
}

form[action="./ResetPasswordSelective.aspx"] {
  #ctl00_ContentPlaceHolder1_divNewPassword, #ctl00_ContentPlaceHolder1_divConfirmPassword {
    display: flex;
    justify-content: center;
    align-items: center;
    .col-md-9 {
      width: 30% !important;
    }
  }
  .resetv2-targetselection-headerrow, .resetv2-targetselection-targetdiv-header-disabled, .resetv2-targetselection-targetdiv-header-enabled {
    div {
      background: transparent !important;
      text-align: center !important;
      @media (max-width: 990px) {
        width: 25% !important;
        display: flex;
        justify-content: center;
      }
    }
  }

  #ctl00_ContentPlaceHolder1_divTargetSelection {
    display: flex;
    flex-direction: column;
    border: #dbdcdd 1px solid !important;
    border-radius: 4px;
    @media (max-width: 576px) {
      border: none !important
    }
  }

  .resetv2-targetselection-targetdiv-header-enabled, .resetv2-targetselection-targetdiv-header-disabled {
      border-top: none !important;
      border-bottom: none !important;
  }

  .resetv2-targetselection-targetdiv-xs-header-disabled, .resetv2-targetselection-targetdiv-xs-header-enabled  {
    span, div {
      font-size: 12px !important;
    }
    .row div {
      width: 33%;
      display: flex;
      justify-content: center;
    }
    .col-12 {
      margin-top: 1rem;
      padding: 10px 0px;
      border: #dbdcdd 1px solid !important;
       border-radius: 4px;
    }
  }

  #PasswordComplexityIndicator {
    p {
      width: auto !important;
    }
  }

  @media (max-width: 576px) {
    .resetv2-targetselection-headerdiv {
      margin-bottom: 0px !important;
    }
  }
  #ctl00_ContentPlaceHolder1_divCompareValidator{
    .col-md-9 {
    display: flex;
    justify-content: center;
    }
  }

  #ctl00_ContentPlaceHolder1_divMessageBoxBootstrapInlineMessageCellOuter {
    margin-bottom: 15px !important;
  }

  #ctl00_ContentPlaceHolder1_divPasswordComplexityIndicator .col-md-3 {
    display: none !important;
  }
}
form[action="./ResetPasswordStatus.aspx"] {
  #collectionTime {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .well.resetv2-outerdiv {
    background-color: transparent !important;
    border: none !important;
  }

  @media (max-width: 812px) {
    .resetv2status-row-header div, .resetv2status-row-odd-statusderived-waiting div, .resetv2status-row-even-statusderived-success div{
      width: 20% !important;
    }
  }
  .resetv2status-row-header {
    height: fit-content;
  }
  @media (max-width: 576px) {
    .d-sm-none  {
     div div {
      width: 50% !important;
     } 
    }
  }
}

/* ? (t) Self Service Custom CSS Start */

/*  All custom css class updates for this theme can be placed here note not all classes will be 
update-able */

/* ? (t) Self Service Custom CSS End */

/* (Important) - Please don't add anything below this! */